<template>
  <section>
    <el-form label-width="100px" :model="pswForm" :rules="rules" ref="pswForm" class="pswArea">
      <el-form-item label="原密码：" prop="oldPsd">
        <el-input v-model="pswForm.oldPsd" type="password"></el-input>
      </el-form-item>
      <el-form-item label="新密码：" prop="newPsd">
        <el-input v-model="pswForm.newPsd" type="password"></el-input>
      </el-form-item>
      <el-form-item label="确认密码：" prop="confirmPsd">
        <el-input v-model="pswForm.confirmPsd" type="password"></el-input>
      </el-form-item>
      <el-form-item label=" ">
        <el-button type="primary" @click="submitForm('pswForm')">提交</el-button>
        <el-button @click="resetForm('pswForm')">重置</el-button>
      </el-form-item>
    </el-form>
    <!--<label>原密码：</label><input type="password" v-model="oldPsd"/><br/>-->
    <!--<label>新密码：</label><input type="password" v-model="newPsd"/><br/>-->
    <!--<label>确认密码：</label><input type="password" v-model="confirmPsd"/><br/>-->
    <!--<el-button>确认修改</el-button>-->
  </section>
</template>
<script>
  export default{
    data(){
      return{
        pswForm:{
          oldPsd:'',
          newPsd:'',
          confirmPsd:'',
        },
        rules:{
          oldPsd:[
            {
              required:true,
              message:'请输入旧密码',
              trigger:'blur',
            }
          ],
          newPsd:[
            {
              required:true,
              message:'请输入新密码',
              trigger:'blur',
            }
          ],
          confirmPsd:[
            {
              required:true,
              message:'请输入确认密码',
              trigger:'blur',
            }
          ],
        },
      }
    },
    methods:{
      submitForm(form){
        this.$http({
          method: 'post',
          url: 'log/resetPsd',
          data: this.pswForm
        }).then((response)=>{
          response = response.data;
          if(response.status == 'SUCCESS'){
            this.$message({
              type:'success',
              message:'修改成功,请重新登录',
            });
            this.$http({
              method: 'post',
              url: '/log/logout',
            }).then((response)=>{
                response = response.data;
                 if(response.status == 'SUCCESS') {
                    this.$router.push({
                        name: 'login'
                    });
                 }
            });
          }else{
            this.$message({
              type:'error',
              message:'修改失败',
            });
          }
        }).catch((err)=>{
            this.$message({
            type:'error',
            message:'修改失败',
          });
        });
      },
      resetForm(form){
        this.$refs[form].resetFields();
      }
    }
  }
</script>
<style scoped>
  section{
    margin: 10px;
    /*line-height: 50px;*/
    /*text-align: center;*/
  }
  .pswArea{
    width: 50%;
    margin: 30px auto;
  }
  /*section>label{*/
    /*text-align: right;*/
    /*display: inline-block;*/
    /*width: 80px;*/
  /*}*/
  /*input{*/
    /*border:1px solid gray;*/
    /*border-radius: 4px;*/
    /*outline-color: #fb7d9b;*/
  /*}*/
</style>